<template>
  <div class="container">
    <div class="item-left">
      <div class="top">
        <router-link to="connectUs"><img src="../../assets/images/cooperation/connect.png"/></router-link>
      </div>
      <div class="text">
        <p>电话：199734214e</p>
        <p>邮箱：199734214@163</p>
      </div>
    </div>

    <div class="item">
      <router-link to="connectUs"><img src="../../assets/images/cooperation/logo.png" width="1000px"/></router-link>
    </div>


  </div>

</template>

<script>
export default {}
</script>

<style scoped>


.container {
  background-image: url("../../assets/images/cooperation/dt.gif");
  width: 100%;
  height: 1200px;
  display: flex; /*设为 Flex 布局以后，子元素的float、clear和vertical-align属性将失效*/
  display: -webkit-flex; /* Safari */
  flex-direction: row; /*容器内项目的排列方向(默认横向排列 row)*/
  flex-wrap: nowrap; /*容器内项目换行方式*/
  justify-content: center; /*项目在主轴上的对齐方式*/
  align-items: center; /*项目在交叉轴上如何对齐*/
  align-content: center; /*定义了多根轴线的对齐方式。如果项目只有一根轴线，该属性不起作用*/
}

.item {
  width: 500px;
  height: 367px;
  margin-left: -85px;
  margin-top: -205px;
}

.item-left {
  /*background: #c9c9c9;*/
  border-radius: 13px;
  position: relative;
  background-color: rgba(255, 255, 255, 0.3);
  z-index: auto;
  /*border: #c9c9c9 solid 1px;*/
  width: 812px;
  height: 570px;
  display: flex; /*设为 Flex 布局以后，子元素的float、clear和vertical-align属性将失效*/
  display: -webkit-flex; /* Safari */
  flex-direction: column; /*容器内项目的排列方向(默认横向排列 row)*/
  flex-wrap: nowrap; /*容器内项目换行方式*/
  justify-content: center; /*项目在主轴上的对齐方式*/
  align-items: center; /*项目在交叉轴上如何对齐*/
  align-content: center; /*定义了多根轴线的对齐方式。如果项目只有一根轴线，该属性不起作用*/
}

.top {
  position: absolute;
  left: 5%;
  bottom: 88%;
  opacity: 1;
}

.text {
  font-size: 38px;
  color: white;
}

</style>